import 'package:cached_network_image/cached_network_image.dart';
import 'package:ff_stars/ff_stars.dart';
import 'package:flutter/material.dart';
import 'package:flutter_douban/config/app_colors.dart';
import 'package:flutter_douban/main_page/home/video/window_video_page.dart';
import 'package:flutter_douban/model/active_big_model.dart';
import 'package:flutter_douban/tool_views/cached_network_Image.dart';
import 'package:like_button/like_button.dart';

import '../../../main.dart';
import 'note_detail_page.dart';

class NoteListView extends StatefulWidget {
  final ActiveBigModel model;
  const NoteListView({Key? key, required this.model}) : super(key: key);

  @override
  _NoteListViewState createState() => _NoteListViewState();
}

class _NoteListViewState extends State<NoteListView> {
  @override
  Future<bool> onLikeButtonTapped(bool isLiked) async {
    return !widget.model.note!.is_collection!;
  }

  Widget build(BuildContext context) {

    Widget titleWidget;
    if(widget.model.note!.title!.length > 0){
      titleWidget = Container(
        color: AppColors.page,
        padding: EdgeInsets.only(bottom: 5),
        child: Text(
          widget.model.note!.title!,
          style: TextStyle(
            color: AppColors.black,
            fontSize: 12,
          ),
          maxLines: 2,
          overflow: TextOverflow.ellipsis,
        ),
      );
    }else{
      titleWidget = Container(
        color: AppColors.page,
        height: 1,
      );
    }

    return InkWell(
      child: Container(
        color: AppColors.page,
        padding: EdgeInsets.all(6),
        child: Stack(
          children: [
            ClipRRect(
              child: CachedNetworkImage(
                fit: BoxFit.cover,
                imageUrl: widget.model.note!.image_u!,
              ),
              borderRadius: BorderRadius.circular(6),
            ),
            Positioned(
                bottom: 0,
                child: Container(
                  color: AppColors.page,
                  width: (MediaQuery.of(context).size.width - 30) / 2,
                  padding: EdgeInsets.only(left: 10, top: 5),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Container(
                        child: FFStars(
                          normalStar: Image.asset(
                              "assets/images/common/collcetionicon_off.png"),
                          selectedStar: Image.asset(
                              "assets/images/common/collcetionicon_on.png"),
                          starsChanged: (realStars, choosedStars) {
                            print("实际选择: ${choosedStars}, 最终得分: ${realStars}");
                          },
                          step: 1.0,

                          /// 用于设置半星(0.5), 整星(1.0), 任意星(0.01), 可在0.01 - 1.0之间自定义, 默认值为0.01
                          // currentStars: 5.0,

                          /// 默认有几颗星星, 默认值为0
                          starCount: 5,

                          /// 一共有几颗星, 默认值5
                          starHeight: 20,

                          /// 星星的高度, 默认30
                          starWidth: 12,

                          /// 星星的宽度,默认30
                          starMargin: 2,

                          /// 星星间的间距, 默认10
                          justShow: true,

                          /// 是否仅做展示, 默认false
                          rounded: true,

                          /// 四舍五入-取最近值, 默认false(进一法)
                        ),
                        height: 20,
                        color: AppColors.page,
                      ),

                      titleWidget,

                      Container(
                        height: 25,
                        width: (MediaQuery.of(context).size.width - 60) / 2,
                        color: AppColors.page,
                        padding: EdgeInsets.only(bottom: 5),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          // crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: [
                                Container(
                                  width: 20,
                                  height: 20,
                                  decoration: BoxDecoration(
                                    color: AppColors.page,
                                    borderRadius: BorderRadius.circular(12),
                                  ),
                                  child: ClipOval(
                                    child: CachedImage(
                                      url: widget.model.note!.author!.p!,
                                      width: 10,
                                      height: 10,
                                    ),
                                  ),
                                ),
                                SizedBox(
                                  width: 5,
                                ),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  width: 60,
                                  child: Text(
                                    widget.model.note!.author!.n!,
                                    style: TextStyle(
                                        fontSize: 11,
                                        color: AppColors.qianTextColor),
                                    maxLines: 1,
                                    overflow: TextOverflow.ellipsis,
                                  ),
                                )
                              ],
                            ),
                            LikeButton(
                              size: 14,
                              likeCount: widget.model.note!.like_count!,
                              isLiked: widget.model.note!.is_collection,
                              countBuilder:
                                  (int? count, bool isLiked, String text) {
                                Widget result;
                                if (isLiked == false) {
                                  result = Text(
                                    text,
                                    style: TextStyle(
                                        color: AppColors.qianTextColor,
                                        fontSize: 10),
                                  );
                                } else
                                  result = Text(
                                    text,
                                    style: TextStyle(
                                        color: Colors.black87, fontSize: 12),
                                  );
                                return result;
                              },
                              likeBuilder: (bool isLiked) {
                                return Image.asset(
                                    'assets/images/common/question_comment_unlike_7@2x.png',
                                    color: isLiked == true
                                        ? AppColors.yellow
                                        : Colors.grey,
                                    width: 18,
                                    height: 18);
                              },
                              likeCountAnimationType:
                                  widget.model.note!.is_collection == true
                                      ? LikeCountAnimationType.part
                                      : LikeCountAnimationType.none,
                              likeCountPadding:
                                  const EdgeInsets.only(left: 5.0),
                              onTap: onLikeButtonTapped,
                            )
                          ],
                        ),
                      )
                    ],
                  ),
                ))
          ],
        ),
      ),
      onTap: (){
        Navigator.of(context).push(MaterialPageRoute(builder: (_) {
          if (widget.model.note?.video_url?.isNotEmpty == true) {
            return WindowVideoPage(
              playType: PlayType.network,
              dataSource: widget.model.note!.video_url!,
              id: int.parse(widget.model.note!.id!),
            );
          } else {
            return NoteDetailPage(
              id: int.parse(widget.model.note!.id!),
            );
          }
        }));
      },
    );
  }
}
